<template>
  <div>
    <!-- from表单 -->
    <el-dialog
      title="添加用户"
      :visible.sync="show"
      width="50%"
      :before-close="closeDialog"
    >
      <div class="from-infomations">
        <el-form ref="form" label-position="left" :model="userInfo" label-width="10rem">
          <el-form-item label="工号">
            <el-tooltip class="item" effect="dark" placement="top-start">
              <div slot="content">注意！工号添加后任何人均不可修改<br>请务必确认工号是否输入正确</div>
              <el-input
                v-model="userInfo.userId"
                clearable
                maxlength="15"
                show-word-limit
                oninput="value=value.replace(/^\.+|[^\d.-]/g,'')"
                style="width:15rem"
              />
            </el-tooltip>

          </el-form-item>
          <el-form-item label="姓名">
            <el-input
              v-model="userInfo.userinfo.userName"
              clearable
              maxlength="5"
              show-word-limit
              style="width:15rem"
            />
          </el-form-item>
          <el-form-item label="密码">
            <template>
              <el-input
                v-model="userInfo.userPwd"
                clearable
                maxlength="16"
                show-word-limit
                style="width:15rem"
              />
              <el-tooltip class="item" effect="dark" placement="top-start">
                <div slot="content">点击设置默认后，密码会默认为工号后四位+123456<br>点击确定后即设置成功</div>
                <el-button type="warning" plain style="margin-left:1rem" size="small" @click="resetUserPwd()">使用默认密码</el-button>
              </el-tooltip>

            </template>
          </el-form-item>
          <el-form-item label="所属党小组">
            <template>
              <el-select v-model="userNewBranch" filterable style="width:15rem">
                <el-option
                  v-for="item in allUserBranch"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </template>
          </el-form-item>
          <!-- 权限选择 -->
          <el-form-item label="所有权限">
            <template>
              <template>
                <el-select
                  v-model="userNewType"
                  multiple
                  filterable
                  allow-create
                  default-first-option
                  style="width:15rem"
                >
                  <el-option
                    v-for="item in allJurisdiction"
                    :key="item.jurisdictionId"
                    :label="item.jurisdictionName"
                    :value="item.jurisdictionId"
                  />
                </el-select>
              </template>
            </template>
          </el-form-item>
        </el-form>
      </div>
      <!-- 还原信息(待添加) -->

      <span slot="footer" class="dialog-footer">
        <el-button @click="closeDialog()">取 消</el-button>
        <el-button type="primary" @click="sendDialog()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { getGroups } from '@/api/branch.js'
import { getAllJurisdiction } from '../../api/jurisdiction.js'
import { addUserInfo, addUser, findAllUser } from '../../api/user.js'
export default {
  props: {
  },
  data() {
    return {
      // 获取的动态数据
      userInfo: {
        userId: '',
        userPwd: '',
        userType: '',
        userTypeName: '',
        userinfo: {
          userName: '',
          userBranch: '',
          userReconsider: '',
          userScore: ''
        }
      },
      // 需要更新的党小组信息
      userNewBranch: [],
      // 需要更新的权限信息
      userNewType: [],

      // 页面存储数据
      show: false,
      allUserBranch: [],
      allJurisdiction: [],
      showBackPwd: false
    }
  },
  created() {
    // dialog信息初始化
    this.createDialogStatus()
  },
  methods: {
    // dialog信息初始化
    createDialogStatus() {
      this.show = false
    },
    // 展示dialog
    showDialog(data) {
      var that = this
      // 获取所有党小组信息
      getGroups().then((res) => {
        const allUserBranch = []
        for (const i in res.obj) {
          const userBranch = {
            value: res.obj[i].branchId,
            label: res.obj[i].branchName
          }
          allUserBranch.push(userBranch)
        }
        that.allUserBranch = allUserBranch
        //  获取用户信息
        that.getJurisdiction()
      })
    },
    // 获取所有权限id和名称
    getJurisdiction() {
      getAllJurisdiction().then((res) => {
        res.obj.splice(0, 1)
        this.allJurisdiction = res.obj
        this.show = true
      })
    },
    // 关闭dialog
    closeDialog() {
      this.$confirm('是否确定取消', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.show = false
        this.userInfo = {
          userId: '',
          userPwd: '',
          userType: '',
          userTypeName: '',
          userinfo: {
            userName: '',
            userBranch: '',
            userReconsider: '',
            userScore: ''
          }
        }
        // 判断是否选择了党小组，如果选择了，删除它
        if (this.userBranch !== '') {
          this.userBranch = ''
        }
        this.$message({
          type: 'success',
          message: '取消修改成功'
        })
      }).catch(() => {})
    },
    // 提交dialog
    sendDialog() {
      var that = this
      // 做拦截
      if (that.userInfo.userId === '') {
        that.$message({
          type: 'warning',
          message: '请输入工号后提交'
        })
      } else if (that.userInfo.userPwd === '') {
        that.$message({
          type: 'warning',
          message: '请输入密码后提交'
        })
      } else if (that.userNewBranch === '') {
        that.$message({
          type: 'warning',
          message: '请选择党小组后再提交'
        })
      } else if (that.userInfo.userinfo.userName === '') {
        that.$message({
          type: 'warning',
          message: '请输入姓名后提交'
        })
      } else if (that.userNewType.length === 0) {
        that.$message({
          type: 'warning',
          message: '请选择权限后再提交'
        })
      } else {
        new Promise(function(resolve, reject) {
          var userTypeStatus = 0
          for (var i = 0; i < that.userNewType.length; i++) {
            if (that.userNewType[i] === '8') {
              userTypeStatus = 1
              break
            }
          }
          resolve(userTypeStatus)
        }).then((data) => {
          if (data !== 1) {
            new Promise(function(resolve, reject) {
              that.$confirm('当前用户无个人权限，若无个人权限则无法在用户端进行登录。点击取消返回修改，点击确定开始提交。', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
              }).then(() => {
                that.$message('正在提交中')
                that.addUserInfo()
                resolve()
              }).catch(() => {
                resolve()
              })
            }).then(() => {

            })
          } else {
            new Promise(function(resolve, reject) {
              that.$confirm('是否确定提交', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
              }).then(() => {
                that.addUserInfo()
                resolve()
              }).catch(() => {
                resolve()
              })
            }).then(() => {

            })
          }
        })
      }
    },
    // 更新userInfo信息
    addUserInfo() {
      // 获取全部数据
      var that = this
      var userInfo = that.userInfo
      var userBranch = that.userNewBranch
      var userType = that.userNewType.toString()
      var userUpdateInfo = {
        userId: '',
        userName: '',
        userReconsider: '',
        userScore: '',
        userBranch: '',
        user: {
          userId: '',
          userPwd: '',
          userType: ''
        }
      }
      // 更新信息
      userUpdateInfo.userId = userInfo.userId
      userUpdateInfo.userName = userInfo.userinfo.userName
      userUpdateInfo.userReconsider = userInfo.userinfo.userReconsider
      userUpdateInfo.userScore = userInfo.userinfo.userScore
      userUpdateInfo.userBranch = userBranch
      userUpdateInfo.userPwd = userInfo.userPwd
      userUpdateInfo.userType = userType
      new Promise(function(resolve, reject) {
        findAllUser().then((res) => {
          var userIdStatus = '0'
          for (var i = 0; i < res.obj.length; i++) {
            if (res.obj[i].userId === userUpdateInfo.userId) {
              userIdStatus = '1'
              break
            }
          }
          resolve(userIdStatus)
        })
      }).then((data) => {
        if (data === '1') {
          that.$message({
            type: 'warning',
            message: '当前工号已存在，无法提交'
          })
        } else {
          that.$message('正在提交中')
          new Promise(function(resolve, reject) {
            addUserInfo(userUpdateInfo).then(res => {
              resolve(res.msg)
            })
          }).then((data) => {
            if (data === '操作成功') {
              addUser(userUpdateInfo).then(res => {
                if (res.obj === null) {
                  that.show = false
                  that.$message({
                    message: '添加成功',
                    type: 'success'
                  })
                  top.location.reload()
                } else {
                  that.$message({
                    message: '服务器异常，请稍后重试',
                    type: 'success'
                  })
                }
              })
            } else {
              that.$message({
                message: '服务器异常，请稍后重试',
                type: 'success'
              })
            }
          })
        }
      })
    },

    // 密码重置
    resetUserPwd() {
      this.userOldPwd = this.userInfo.userPwd
      this.showBackPwd = true
      this.userInfo.userPwd = this.userInfo.userId.substring(this.userInfo.userId.length - 4, this.userInfo.userId.length) + '123456'
    }

  }
}
</script>
<style lang="scss">

</style>
